$(function () {
  let nav_list = ""
  let product_items = "";
  //注册navDom元素 
  let nav_container = $('.container')
  //注册productDom元素
  let product = $('.info')
  
  //nav
  fetch('http://chst.vip:1234/api/getindexmenu')
    .then(body => body.json())
    .then(res => {
      res.result.forEach(element => {
        //跳转的网页
        let targetUrl = element.titlehref;
        //正则把img的url正则出来
        let reg = /([^"]+)/g;
        let imgUrl = element.img.match(reg);
        imgUrl = imgUrl[1].replace(/images\//ig, '')
        imgUrl = "http://chst.vip:8081/for-stu/wfzh/images/" + imgUrl;
        //生成nav
        nav_list += `
      <li>
        <a href="${targetUrl}">
          <span>
            <img src="${imgUrl}" alt="">
          </span>
        </a>
        <p>${element.name}</p>
      </li>`
      });


      //将nav_list 添加到网页中
      nav_container.append(nav_list);

      //将最后四个nav隐藏
      $('li:eq(8),li:eq(9),li:eq(10),li:eq(11)').css({
        display: 'none'
      })
      //点击更多显示或隐藏
      $('li').on('click', function (e) {

        if (this.outerText === "更多") {
          e.preventDefault()
          let dropItems = $(this).nextAll();
          // dropItems.finish().slideToggle(400);
          $(dropItems).stop().slideToggle(500)
        }
      })

    })

  //product
  fetch('http://chst.vip:1234/api/getmoneyctrl')
    .then(body => body.json())
    .then(res => {
      result = res.result
      result.forEach(element => {
        let reg = /(?<=imgurl=)[^'"]*/;
        let imgUrl = element.productImg2.match(reg);
        product_items += `
        <li id=${element.productId}>
          <a href="">
            <div class="img">
              <img src="${imgUrl[0]}" alt="">
            </div>
            <div class="infoR clear">
              <div class="title">
                <h4>${element.productName}
                  <span>${element.productPinkage}</span>
                </h4>
              </div>
            <div class="other">
              <span>${element.productFrom}     |${element.productTime}</span>
                <em>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-xiaoxi"></use>
                  </svg>
                  <span> ${element.productComCount}</span>
                </em>
            </div>
          </div>
        </a>
      </li>
        `
      });
      //添加内容到product中
      product.append(product_items);
      //点击将id复制到url地址栏中
      product.on('click','li',function(e){
        e.preventDefault()
        let targetUrl = "./productid.html" + '?' + $(this).attr('id');
        window.location = targetUrl;
      })
    })
})
